import { Component } from "@angular/core";
import {
  IonicPage,
  NavController,
  NavParams,
  ActionSheetController,
  ToastController,
  Events,
  App
} from "ionic-angular";
import { Camera, CameraOptions } from "@ionic-native/camera";
import {
  FileTransfer,
  FileUploadOptions,
  FileTransferObject
} from "@ionic-native/file-transfer";
import { BaseUI } from "../../../../common/baseUI";
import { TeamSeriveProvider } from "../../../../providers/team-serive/team-serive";
import { ModalController, LoadingController } from "ionic-angular";
import { SlidePhotoPage } from "../../../../components/camera/slide-photo/slide-photo";
/**
 * Generated class for the TeamNewPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */
 
@IonicPage()
@Component({
  selector: "page-team-new",
  templateUrl: "team-new.html"
})
export class TeamNewPage extends BaseUI {
  fileTransfer: FileTransferObject = this.transfer.create();
  path;
  //拍照上传之后图片返回的地址
  photoReturnUrl = "";
  //团队名字
  teamName: string;

  pictures: any = [];
  //预览图片的地址
  picturesFullPath: any = [];
  picturesTemp;
  isMe = true;
  userId;

  constructor(
    public navCtrl: NavController,
    public navParams: NavParams,
    public actionSheetCtrl: ActionSheetController,
    private camera: Camera,
    private transfer: FileTransfer,
    public toastCtrl: ToastController,
    public teamSeriveProvider: TeamSeriveProvider,
    public events: Events,
    public app: App,
    public loadingCtrl: LoadingController,
    public modalCtrl: ModalController
  ) {
    super();
  }

  ionViewDidLoad() {}

  //创建团队事件
  createTeam() {
    if (this.photoReturnUrl) {
      if (this.teamName.trim()) {
        //请求服务器 判断团队名称是否重复
        this.teamSeriveProvider.getTeamNameRepeat(this.teamName).subscribe(
          data => {
            if (data.msg == "OK" && data.status == 200) {
              //请求服务器 创建团队
              this.teamSeriveProvider
                .cerateTeam(this.teamName, this.photoReturnUrl)
                .subscribe(
                  c => {
                    if (c["msg"] == "OK" && c["status"] == 200) {
                      super.showToast(this.toastCtrl, "创建团队成功");
                      this.events.publish("team:created"); //发布团队创建事件
                      this.navCtrl.pop();
                    }
                    if (data.status == 500) {
                      this.loginTimeOut();
                    }
                  },
                  err => {
                    super.showToast(this.toastCtrl, "请检查网络连接之后重试");
                  }
                );
              return;
            }

            if (data.status == 500) {
              this.loginTimeOut();
              return;
            }
            super.showToast(this.toastCtrl, "这个团队名称已经被别人使用啦");
          },
          err => {
            super.showToast(this.toastCtrl, "请检查网络连接之后重试");
          }
        );
        return;
      }
      super.showToast(this.toastCtrl, "请输入团队名称");
    } else {
      super.showToast(this.toastCtrl, "请先选中团队头像");
    }
  }

  //返回
  back() {
    this.navCtrl.pop();
  }

  //登录超时
  loginTimeOut() {
    super.showToast(this.toastCtrl, "登录失效，请重新登录");
    this.app.getRootNav().setRoot("LoginOrRegisterPage");
    return;
  }

  // 放大图片
  zoomImage(index) {
    this.navCtrl.push(SlidePhotoPage, {
      i: index,
      photo: this.picturesFullPath
    });
  }

  //头像上传成功之后触发
  pickPictures($event) {
    //$event[0] 图片上传之后服务器返回的数据
    this.pictures = $event.pictures;
    this.photoReturnUrl = this.pictures[0].data;
  }

  //删除图片触发
  deletedPictures($event){
    this.photoReturnUrl = null;
  }

  up($event){  
    //去除emoji表情
    this.teamName = this.teamName.replace(/[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/ig, '');
  }
}
